/* 分析：
    1.发送 ajax请求  2.将用户信息存储到storage 3.渲染下拉框
 */
function getStudentInfo() {
    $.ajax({
        url:"http://localhost/lin/server/server/userInfo.php",
        success(msg){
            /* 当前页是第一页 */
            sessionStorage.setItem("currentPage",1)
            // 将数据存储一份到storage里面
            sessionStorage.setItem("studentInfo", msg);
            //将数据转换成对象,从对象当中取出10条,用于渲染工作
            msg = JSON.parse(msg).slice(0, 10);
            //调用渲染页面
            
            /*  const uulever = document.querySelector("#uulever"); */
          /*   msg = JSON.parse(msg1) */
            renderPage(msg);
        } 
    })
} 
getStudentInfo();
function renderPage(msg){
    const tbody = document.querySelector("#tb")
    tbody.innerHTML = "";
    msg.forEach((item, index) => {
        let str = `
            <tr>
                <td>${item.uid}</td>
                <td>${item.username}</td>
                <td>${item.password}</td>
                <td>${item.gender}</td>
                <td>${item.ulever}</td>
                <td>${item.phone}</td>
                <td>${item.email}</td>
                <td>
                    <button type="button" class="btn btn-outline" data-bs-toggle="modal" data-bs-target="#myModal"id='${item.uid}' data-upd = 'upd'>编辑</button>
                    <button type="button" class="btn btn-outline"id='${item.uid}'data-del = 'del'>删除</button>
                </td>
            <tr>
            
        `   
        tbody.innerHTML  += str; 
    })
}
/* 删除操作 
    1.获取tbody,(利用事件的委托)
    2.获取点击的按钮
    3.发送ajax之前，防止误删
    4.刷新页面
*/
const tbody = document.querySelector("tbody")
tbody.onclick = function (e) {
    //2.获取点击的按钮
    e = e || window.event
    /*   console.log(e.target.dataset,e.target.id); */
    if (e.target.dataset.del == 'del') {
        //防止误删 */
        const res = confirm("确认是否删除用户")
        if (res) {
          /*   console.log(res); */
              $.ajax({
                 url:"http://localhost/lin/server/server/userDelete.php",
                 data:{id: e.target.id},
                 success() {
                     location.reload();
                 }
                 
             }) 
        }
    }
        //修改
    if(e.target.dataset.upd == 'upd') {
        
            //获取修改的那个id，获取当前点击的信息
        $.ajax({
            url:"http://localhost/lin/server/server/userOne.php",
            data:{id:e.target.id},
                success(msg1){
                    msg1 =JSON.parse(msg1)
                    $("#uname").val(msg1.username);
                    $("#upassword").val(msg1.password);
                    $("#compile").val(msg1.uid);
                    if(msg1.gender == '男'){
                        $(".updatesex")[0].checked = true;
                    }else{
                        $(".updatesex")[1].checked =true;
                    }
                    $("#ulever").val(msg1.ulever);
                    $("#uphone").val(msg1.phone);
                    $("#uemail").val(msg1.email);
                  /*   console.log( $("#uulever").val(msg1.ulever)); */
                }
                
            })
        }
    } 

//  编辑操作 
function userUpdate() {
    const id = document.querySelector("#compile").value
    const uname = document.querySelector("#uname").value
    const upassword = document.querySelector("#upassword").value
    const ulever = document.querySelector("#ulever").value
    const uphone = document.querySelector("#uphone").value
    const uemail = document.querySelector("#uemail").value
    let sex = document.querySelectorAll(".updatesex")
    let gender;
    if(sex[0].checked == true) {
        gender = '男'
    }else{
        gender = "女"
    } 
    //2.校验
   if(!(uname || upassword  || uphone || uemail)){
        return alert ("请输入完整的数据！")
    } 
    /*  console.log(id,uname,upassword,ulever,uphone,uemail,gender);  */
      $.ajax({
        type:"POST",
        url:"http://localhost/lin/server/server/userUpdate.php",
        data:{id,uname,upassword,gender,uemail,uphone,ulever},
        success(){
            location.reload();
        }
    })  

}

/* 添加用户信息 
    1. 收集表单数据
    2.校验
    3.发送请求
*/
function ok() {
    const username = document.querySelector("#username").value
    const password = document.querySelector("#password").value
    const lever = document.querySelector("#lever").value
    const phone = document.querySelector("#phone").value
    const email = document.querySelector("#email").value
    const esex = document.querySelectorAll(".esex");
   /*  const address = document.querySelector("#address").value */
    let ugender;
    for (let i = 0; i < esex.length; i++) {
        //获取选中的那个value值
        if(esex[i].checked){
            ugender = esex[i].value;
        }
    }
    if(!(username || password  || phone || email)){
        return alert ("请添加完成数据！")
    }
    // console.log(username,password,ugender,email,phone,lever);
     $.ajax({
        type:"POST",
        url:"http://localhost/lin/server/server/userAdd.php",
        data:{username:username,password:password,gender:ugender,email:email,phone:phone,ulever:lever},
        success(){
            location.reload();
        }

    }) 
}

/* 首页操作 */
function shou(){
    sessionStorage.setItem("pageCurrent",1)

    let studentInfo = sessionStorage.getItem("studentInfo")

    studentInfo = JSON.parse(studentInfo).slice(0,10)

    renderPage(studentInfo);
}

/* 尾页 */
function wei() {
   let studentInfo = sessionStorage.getItem("studentInfo")//33
   studentInfo = JSON.parse(studentInfo)
   sessionStorage.setItem("currentPage",Math.ceil(studentInfo.length / 10))
   studentInfo = studentInfo.slice(Math.floor(studentInfo.length / 10) * 10,studentInfo.length)
   renderPage(studentInfo);
}


/* 上一页*/
function shang() {
    let currentPage = +sessionStorage.getItem("currentPage")
    currentPage = currentPage -1;
    if(currentPage < 1) currentPage =1;
    sessionStorage.setItem("currentPage",currentPage)
    let studentInfo = sessionStorage.getItem("studentInfo")
    studentInfo = JSON.parse(studentInfo).slice((currentPage - 1) * 10,currentPage * 10)
    renderPage(studentInfo)
}

/* 上一页 */
function xia(){
    let currentPage = +sessionStorage.getItem("currentPage")
    let studentInfo = sessionStorage.getItem("studentInfo")
    studentInfo = JSON.parse(studentInfo)
    currentPage = currentPage + 1;
    if(currentPage > Math.ceil(studentInfo.length / 10)) currentPage = Math.ceil(studentInfo.length / 10);
    sessionStorage.setItem("currentPage",currentPage)
    studentInfo = studentInfo.slice((currentPage - 1) * 10 , currentPage *10)
    renderPage(studentInfo);
}